<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>index</title>
    <link rel="stylesheet" href="lib/normalize.css">
    <link rel="stylesheet" href="stylesheets/index.css">
    <link rel="stylesheet" href="stylesheets/modal.css">
    <link rel="stylesheet" href="stylesheets/notice.css">
</head>
<body>
<h1>建筑机电设备智能控制无中心网络测试平台</h1>
<div id="main">
    <div class="normal-row" id="row-0">
        <div class="connected icon" data-nodeId="0"></div>
        <div class="line hor-line" data-connectNodes="0-1"></div>
        <div class="connected icon" data-nodeId="1"></div>
        <div class="line hor-line" data-connectNodes="1-2"></div>
        <div class="connected icon" data-nodeId="2"></div>
        <div class="line hor-line" data-connectNodes="2-3"></div>
        <div class="connected icon" data-nodeId="3"></div>
        <div class="line hor-line" data-connectNodes="3-4"></div>
        <div class="connected icon" data-nodeId="4"></div>
        <div class="line hor-line" data-connectNodes="4-5"></div>
        <div class="connected icon" data-nodeId="5"></div>
    </div>
    <div class="vertical-short-line-row">
        <div class="line vertical-line vertical-short-line" data-connectNodes="0-6"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="1-7"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="2-8"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="3-9"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="4-10"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="5-11"></div>
    </div>
    <div class="normal-row" id="row-1">
        <div class="connected icon" data-nodeId="6"></div>
        <div class="line hor-line" data-connectNodes="6-7"></div>
        <div class="connected icon" data-nodeId="7"></div>
        <div class="line hor-line" data-connectNodes="7-8"></div>
        <div class="connected icon" data-nodeId="8"></div>
        <div class="line hor-line" data-connectNodes="8-9"></div>
        <div class="connected icon" data-nodeId="9"></div>
        <div class="line hor-line" data-connectNodes="9-10"></div>
        <div class="connected icon" data-nodeId="10"></div>
        <div class="line hor-line" data-connectNodes="10-11"></div>
        <div class="connected icon" data-nodeId="11"></div>
    </div>
    <div class="vertical-long-line-row">
        <div class="line vertical-line vertical-long-line" data-connectNodes="6-12"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="7-13"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="8-14"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="9-15"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="10-16"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="11-17"></div>
    </div>

    <div class="normal-row" id="row-2">
        <div class="connected icon" data-nodeId="12"></div>
        <div class="line hor-line" data-connectNodes="12-13"></div>
        <div class="connected icon" data-nodeId="13"></div>
        <div class="line hor-line" data-connectNodes="13-14"></div>
        <div class="connected icon" data-nodeId="14"></div>
        <div class="line hor-line" data-connectNodes="14-15"></div>
        <div class="connected icon" data-nodeId="15"></div>
        <div class="line hor-line" data-connectNodes="15-16"></div>
        <div class="connected icon" data-nodeId="16"></div>
        <div class="line hor-line" data-connectNodes="16-17"></div>
        <div class="connected icon" data-nodeId="17"></div>
    </div>
    <div class="vertical-short-line-row">
        <div class="line vertical-line vertical-short-line" data-connectNodes="12-18"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="13-19"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="14-20"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="15-21"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="16-22"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="17-23"></div>
    </div>
    <div class="normal-row" id="row-3">
        <div class="connected icon" data-nodeId="18"></div>
        <div class="line hor-line" data-connectNodes="18-19"></div>
        <div class="connected icon" data-nodeId="19"></div>
        <div class="line hor-line" data-connectNodes="19-20"></div>
        <div class="connected icon" data-nodeId="20"></div>
        <div class="line hor-line" data-connectNodes="20-21"></div>
        <div class="connected icon" data-nodeId="21"></div>
        <div class="line hor-line" data-connectNodes="21-22"></div>
        <div class="connected icon" data-nodeId="22"></div>
        <div class="line hor-line" data-connectNodes="22-23"></div>
        <div class="connected icon" data-nodeId="23"></div>
    </div>
    <div class="vertical-long-line-row">
        <div class="line vertical-line vertical-long-line" data-connectNodes="18-24"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="19-25"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="20-26"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="21-27"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="22-28"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="23-29"></div>
    </div>

    <div class="normal-row" id="row-4">
        <div class="connected icon" data-nodeId="24"></div>
        <div class="line hor-line" data-connectNodes="24-25"></div>
        <div class="connected icon" data-nodeId="25"></div>
        <div class="line hor-line" data-connectNodes="25-26"></div>
        <div class="connected icon" data-nodeId="26"></div>
        <div class="line hor-line" data-connectNodes="26-27"></div>
        <div class="connected icon" data-nodeId="27"></div>
        <div class="line hor-line" data-connectNodes="27-28"></div>
        <div class="connected icon" data-nodeId="28"></div>
        <div class="line hor-line" data-connectNodes="28-29"></div>
        <div class="connected icon" data-nodeId="29"></div>
    </div>
    <div class="vertical-short-line-row">
        <div class="line vertical-line vertical-short-line" data-connectNodes="24-30"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="25-31"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="26-32"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="27-33"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="28-34"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="29-35"></div>
    </div>
    <div class="normal-row" id="row-5">
        <div class="connected icon" data-nodeId="30"></div>
        <div class="line hor-line" data-connectNodes="30-31"></div>
        <div class="connected icon" data-nodeId="31"></div>
        <div class="line hor-line" data-connectNodes="31-32"></div>
        <div class="connected icon" data-nodeId="32"></div>
        <div class="line hor-line" data-connectNodes="32-33"></div>
        <div class="connected icon" data-nodeId="33"></div>
        <div class="line hor-line" data-connectNodes="33-34"></div>
        <div class="connected icon" data-nodeId="34"></div>
        <div class="line hor-line" data-connectNodes="34-35"></div>
        <div class="connected icon" data-nodeId="35"></div>
    </div>
    <div class="vertical-long-line-row">
        <div class="line vertical-line vertical-long-line" data-connectNodes="30-36"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="31-37"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="32-38"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="33-39"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="34-40"></div>
        <div class="line vertical-line vertical-long-line" data-connectNodes="35-41"></div>
    </div>

    <div class="normal-row" id="row-6">
        <div class="connected icon" data-nodeId="36"></div>
        <div class="line hor-line" data-connectNodes="36-37"></div>
        <div class="connected icon" data-nodeId="37"></div>
        <div class="line hor-line" data-connectNodes="37-38"></div>
        <div class="connected icon" data-nodeId="38"></div>
        <div class="line hor-line" data-connectNodes="38-39"></div>
        <div class="connected icon" data-nodeId="39"></div>
        <div class="line hor-line" data-connectNodes="39-40"></div>
        <div class="connected icon" data-nodeId="40"></div>
        <div class="line hor-line" data-connectNodes="40-41"></div>
        <div class="connected icon" data-nodeId="41"></div>
    </div>
    <div class="vertical-short-line-row">
        <div class="line vertical-line vertical-short-line" data-connectNodes="36-42"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="37-43"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="38-44"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="39-45"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="40-46"></div>
        <div class="line vertical-line vertical-short-line" data-connectNodes="41-47"></div>
    </div>
    <div class="normal-row" id="row-7">
        <div class="connected icon" data-nodeId="42"></div>
        <div class="line hor-line" data-connectNodes="42-43"></div>
        <div class="connected icon" data-nodeId="43"></div>
        <div class="line hor-line" data-connectNodes="43-44"></div>
        <div class="connected icon" data-nodeId="44"></div>
        <div class="line hor-line" data-connectNodes="44-45"></div>
        <div class="connected icon" data-nodeId="45"></div>
        <div class="line hor-line" data-connectNodes="45-46"></div>
        <div class="connected icon" data-nodeId="46"></div>
        <div class="line hor-line" data-connectNodes="46-47"></div>
        <div class="connected icon" data-nodeId="47"></div>
    </div>
</div>

<script src="lib/polyfill.min.js"></script>
<script src="lib/jquery.min.js"></script>
<script src="lib/axios.min.js"></script>
<script src="lib/socket.io.js"></script>

<script src="scripts/dist/config.js"></script>
<script src="scripts/dist/functions.js"></script>
<script src="scripts/dist/index.js"></script>
<script src="scripts/dist/modal.js"></script>

<!--<script src="scripts/config.js"></script>
<script src="scripts/functions.js"></script>
<script src="scripts/index.js"></script>
<script src="scripts/modal.js"></script>-->
</body>
</html>